<template>
    <div>
        <a-modal v-model="visible" title="修改学生" v-bind="layout" @ok="handleOk">
            <a-form-model v-bind="layout">
                <a-form-model-item has-feedback label="姓名" prop="name">
                    <a-input v-model="student.name" />
                </a-form-model-item>
                <a-form-model-item has-feedback label="年龄" prop="age">
                    <a-input v-model="student.age" />
                </a-form-model-item>
                <a-form-model-item has-feedback label="性别" prop="gender">
                    <a-radio-group  v-model="student.gender" name="addGender" >
                        <a-radio value="男"> 男 </a-radio>
                        <a-radio value="女"> 女 </a-radio>
                    </a-radio-group>
                </a-form-model-item>
            </a-form-model>
        </a-modal>
    </div>
</template>

<script>
import { mapMutations, mapState } from 'vuex';
import {update} from '../../services/student'
export default {
    data(){
        return {
            layout: {
                labelCol: { span: 4 },
                wrapperCol: { span: 16 },
            },
        }
    },
    computed:{
        ...mapState('student',['student']),
        visible:{
            get(){
                console.log(this);
                // console.log("get",this.$store.state.student.visible);
                return this.$store.state.student.visible;
            },
            set(visible){
                console.log(visible);
                this.setVisible(visible);
            }
        }
    },
    methods:{
        ...mapMutations('student',['setVisible']),
        async handleOk(){
           console.log("ok");
           await update(this.student);
        //    this.$emit('update:visible',false)
           this.$emit("show")
           this.setVisible(false)
        },
        handleCancel(){
            console.log("cancel");
        }
    }
 
};
</script>

<style>
</style>